<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="-1">
<link rel='stylesheet' type='text/css' href='styles/index.css' />
<script type="text/javascript" src="background.js"></script>
<title>Imago</title>
</head>
<body><output><img src="" style="width:0px;height:0px;"/></output></body>
<script>
	document.body.style.backgroundColor = (eval(widget.preferences.imago_background_isTransparent) ? 'transparent' : widget.preferences.imago_background_colour);
	if (opera.contexts.speeddial) {
		var sd = opera.contexts.speeddial; 
		sd.title = widget.preferences.imago_title;
		sd.url = widget.preferences.imago_url; 
	}
	var output = document.querySelector('output');
	
	output.innerHTML="<img id=\"image\" src=\"" + widget.preferences.imago_image_url + "\"/>";
	var image = document.getElementById('image');
	switch(widget.preferences.imago_image_size) {
		case 'no':
			break;
		case 'fitWidth':
		default:
			image.style.width='100%';
			break;
		case 'fitHeight':
			image.style.height='100%';
			break;
		case 'fitBoth':
			image.style.width='100%';
			image.style.height='100%';
			break;
		case 'manual':
			image.style.width = (widget.preferences.imago_image_size_manual_width==''? '': widget.preferences.imago_image_size_manual_width);
			image.style.height = (widget.preferences.imago_image_size_manual_height=='' ? '': widget.preferences.imago_image_size_manual_height );
			break;
	}
	
	image.style.position='absolute';
	switch(widget.preferences.imago_image_position) {
		case 'topLeft':
			image.style.left = 0;
			image.style.top = 0;
			break;
		case 'topCenter':
			image.style.left = document.body.clientWidth / 2 - image.clientWidth / 2;
			image.style.top = 0;
			break;
		case 'topRight':
			image.style.right = 0;
			image.style.top = 0;
			break;
		case 'middleLeft':
			image.style.left = 0;
			image.style.top = document.body.clientHeight / 2 - image.clientHeight / 2;
			break;
		case 'middleCenter':
		default:
			image.style.left = document.body.clientWidth / 2 - image.clientWidth / 2;
			image.style.top = document.body.clientHeight / 2 - image.clientHeight / 2;
			break;
		case 'middleRight':
			image.style.right = 0;
			image.style.top = document.body.clientHeight / 2 - image.clientHeight / 2;
			break;
		case 'bottomLeft':
			image.style.left = 0;
			image.style.bottom = 0;
			break;
		case 'bottomCenter':
			image.style.left = document.body.clientWidth / 2 - image.clientWidth / 2;
			image.style.bottom = 0;
			break;
		case 'bottomRight':
			image.style.right = 0;
			image.style.bottom = 0;
			break;
		case 'manual':
			image.style.top=(widget.preferences.imago_image_position_manual_top==''? '': widget.preferences.imago_image_position_manual_top);
			image.style.bottom=(widget.preferences.imago_image_position_manual_bottom==''? '': widget.preferences.imago_image_position_manual_bottom);
			image.style.left=(widget.preferences.imago_image_position_manual_left==''? '': widget.preferences.imago_image_position_manual_left);
			image.style.right=(widget.preferences.imago_image_position_manual_right==''? '': widget.preferences.imago_image_position_manual_right);
			break;
	}

</script>
</html>
